import { Role } from '@/api/interface';
import { BasicForm } from '@/components/ProForm/interface';
import { CustomTableInterface } from '@/components/ProTable/interface';
import { PublicInterface } from '@/interface/public';

export function useDataGrid(proTableBox: PublicInterface.ProTableValue, addForm: BasicForm) {
  // 权限菜单
  let permissionMenu = ref({
    // 权限配置弹框
    visible: false,
    roleId: -1,
    // 修改人员弹框
    updateRoleUserVisible: false
  });

  let dataGrid = reactive<CustomTableInterface>({
    // 表格配置项
    columns: [
      { prop: 'operation', label: 'operation', fixed: 'left', width: 310 },
      {
        isShow: false,
        prop: 'key',
        search: {
          el: 'input',
          key: 'key',
          label: '关键值',
          props: {
            placeholder: '请输入关键值'
          }
        }
      },
      {
        prop: 'roleName',
        label: '角色名称'
      },
      {
        prop: 'userNameStr',
        label: '角色人员'
      },

      { prop: 'remark', label: 'remark' }
    ],
    headButtonList: [
      {
        label: 'add',
        type: 'primary',
        // permissionCode: 'p:auth:role:save',
        icon: 'Plus',
        methods: () => {
          formChangeItemStatus(addForm, ['remark'], false, 'hide');
          formChangeItemStatus(addForm, ['userIds'], true, 'hide');
          formOpen<Role.ResRoleList>(addForm, 'NewRole');
        }
      }
    ],
    rowButtonList: [
      {
        label: 'edit',
        // permissionCode: 'p:auth:role:save',
        type: 'primary',
        hide: row => row.name !== useUserStore().IDENTITY_ADMIN,
        methods: row => {
          formChangeItemStatus(addForm, ['remark'], false, 'hide');
          formChangeItemStatus(addForm, ['userIds'], true, 'hide');

          formOpen<Role.ResRoleList>(addForm, 'editUsers', row);
        },
        attrs: {
          link: true
        }
      },
      {
        label: '修改人员',
        type: 'primary',
        // permissionCode: 'p:auth:role:editUser',
        methods: row => {
          Object.assign(permissionMenu.value, {
            roleId: row.id,
            updateRoleUserVisible: true
          });
        },
        attrs: {
          link: true
        }
      },
      {
        label: 'permissionSetting',
        type: 'primary',
        // permissionCode: 'p:auth:role:allocation',
        // hide: row => row.status === 0,
        methods: row => {
          Object.assign(permissionMenu.value, {
            roleId: row.id,
            visible: true
          });
        },
        attrs: {
          link: true
        }
      },
      {
        label: 'delete',
        type: 'danger',
        // permissionCode: 'p:auth:role:remove',
        hide: row => row.roleName !== '超级管理员',
        methods: row => {
          const params = { id: row.id, roleName: row.roleName };
          const name = `${transitionLanguages('button', 'delete')}【${row.roleName}】${transitionLanguages('table', 'role')}`;
          useHandleData(roleRemove, params, name, proTableBox.value?.getTableList);
        },
        attrs: {
          link: true
        }
      }
    ]
  });

  // 对表格返回数据信息处理
  const tableDataCallback = data => {
    // data.forEach(item => {
    //   const userList = item.userList || [];
    //   item.userNameStr = arrJoinToStr(userList, 'name');
    //   item.userIds = arrLiftField(userList, 'id') as Array<number>;
    // });
    console.log(data, 'data');

    return data;
  };
  return {
    dataGrid,
    permissionMenu,
    tableDataCallback
  };
}
